<template>
	<div class="indexContent">
		<Header @eliminateLog="eliminateLog"></Header>
		<div class="middleContent">
			<Sidebar></Sidebar>
			<div class="mainContent">
				<router-view />
			</div>
		</div>
		<Footer></Footer>
		<!-- 日志清除 -->
		<AlertBox :alertBoxVisible="alertBoxIssueVisible">
			<div class="contentBox" style="margin-top: 24vh">
				<div class="contentBox_header">
					<p>日志清除配置</p>
					<i class="wj-icon-guanbi" @click="alertBoxIssueclose"></i>
				</div>
				<div class="contentBox_body">
					<div class="infoRow_form">
						<span>时段选择</span>
						<div class="form-item">
							<el-select ref="edifFormSelect1" v-model="clear_time" placeholder="请选择日志清除时段" @change="select_clear_time">
								<el-option v-for="(item, index) in times" :key="index" :label="item.label" :value="item.value"> </el-option>
							</el-select>
						</div>
						<span class="form-hint">提示：用户可以手动清除3个月前或者6个月前日志，请谨慎操作。</span>
					</div>
				</div>
				<div class="contentBox_footer">
					<wj-Button type="save" @click="handleDetailsConfirm">确定</wj-Button>
				</div>
			</div>
		</AlertBox>
	</div>
</template>
<script>
import Header from "@/views/common/Header";
import Footer from "@/views/common/Footer";
import Sidebar from "@/views/common/Sidebar";
import { audit_clear_log } from "@/utils/request/api";
export default {
	name: "Index",
	components: {
		Header,
		Footer,
		Sidebar,
	},
	data() {
		return {
			alertBoxIssueVisible: false, // 日志清除
			clear_time: "", // 日志清除时段
			// 日志清除选择数据
			times: [
				{
					value: "90",
					label: "3个月",
				},
				{
					value: "180",
					label: "6个月",
				},
			],
		};
	},
	created() {},
	mounted() {},
	methods: {
		eliminateLog() {
			this.alertBoxIssueVisible = true;
		},
		select_clear_time(value) {
			console.log("选择时段..." + value);
		},
		// alertBox—— 关闭
		alertBoxIssueclose() {
			this.alertBoxIssueVisible = false;
		},
		// alertBox—— 确认
		handleDetailsConfirm() {
			if (this.clear_time != "") {
				this.$confirm("日志清除操作不可逆,是否继续 ?", "温馨提示", {
					confirmButtonText: "确定",
					cancelButtonText: "取消",
					type: "warning",
				})
					.then(() => {
						// 确认操作
						audit_clear_log({
							logSaveDate: this.clear_time,
						}).then((res) => {
							console.log(res);
							if (res.code == 200) {
								this.$msg.success("日志清除成功");
								this.alertBoxIssueVisible = false;
							} else {
								this.$msg.error("日志清除失败");
							}
						});
					})
					.catch(() => {
						// 取消操作
						this.$msg.info("已取消操作！");
					});
			} else {
				this.$msg.warning("请选择日志清除时段");
			}
		},
	},
};
</script>
<style lang="less" scoped>
.indexContent {
	width: 100%;
	height: 100%;
	display: flex;
	flex-direction: column;
	justify-content: flex-start;
	align-items: center;
	.middleContent {
		width: 100%;
		height: calc(100% - 68px - 68px);
		box-sizing: border-box;
		padding: 2px 0 0;
		background: #f2f2f2;
		display: flex;
		flex-direction: row;
		justify-content: flex-start;
		align-items: center;
		.mainContent {
			width: 86%;
			height: 100%;
			margin-left: 2px;
		}
	}
}
</style>
